<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true">
      <el-form-item label="">
        <el-select filterable clearable style="width: 140px" v-model="queryParams.railwayId" placeholder="线名">
          <el-option v-for="dict in railwayNamearr" :label="dict.railwayName" :value="dict.railwayId"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="">
        <el-input style="width: 140px" v-model="queryParams.stationName" placeholder="车站名称" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="">
        <el-input style="width: 140px" v-model="queryParams.stationCode" placeholder="车站编号" clearable @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="handleQuery">搜索</el-button>
        <el-button type="primary" @click="congzhiQuery">重置</el-button>
        <el-button @click="handleAdd">添加</el-button>
      </el-form-item>
    </el-form>

    <el-table v-loading="loading" :data="stationList" height="62vh">
      <!-- <el-table-column label="单位名称" prop="unitName" /> -->
      <el-table-column label="线路名称" prop="railwayName" />
      <el-table-column label="车站名称" prop="stationName" />
      <el-table-column label="车站编号" prop="stationCode" />
      <el-table-column label="中心里程" prop="centerMileage" />
      <!-- <el-table-column label="起点里程" prop="startMileage" />
      <el-table-column label="终点里程" prop="endMileage" /> -->
      <el-table-column label="拼音字头" prop="spellingPrefix" />
      <el-table-column label="车站等级" prop="stationLevel" />
      <!-- <el-table-column label="轨距类型" prop="gaugeType" />
      <el-table-column label="最小半径" prop="minRadius" />
      <el-table-column label="最大坡度" prop="maxGrade" />
      <el-table-column label="股道数" prop="trackNumber" />
      <el-table-column label="道岔数" prop="turnoutNumber" />
      <el-table-column label="下行进站机" prop="downInboundMachine" />
      <el-table-column label="下行有效长" prop="downEffectiveLength" />
      <el-table-column label="上行进站机" prop="upInboundMachine" />
      <el-table-column label="上行有效长" prop="upEffectiveLength" />
      <el-table-column label="上行反向进站机" prop="upOppositeMachine" />
      <el-table-column label="下行反向进站机" prop="downOppositeMachine" />
      <el-table-column label="是否过站中心" prop="isPassCenter" />
      <el-table-column label="经度" prop="longitude" />
      <el-table-column label="纬度" prop="latitude" /> -->
      <el-table-column label="操作" class-name="small-padding fixed-width">
        <template #default="scope">
          <el-button link type="primary" @click="handleUpdate(scope.row)">修改</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 添加或修改基础数据-车站数据对话框 -->
    <el-dialog :title="title" v-model="open" width="700px" append-to-body>
      <el-form ref="form" :model="forma" :rules="rules" label-width="120px" :inline="true">
        <el-form-item label="单位名称" prop="unitId">
          <el-select filterable clearable style="width: 180px" v-model="forma.unitId" placeholder="请选择">
            <el-option v-for="dict in unitNameobj" :label="dict.unitName" :value="dict.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="线路名称" prop="railwayId">
          <el-select filterable clearable style="width: 180px" v-model="forma.railwayId" placeholder="请选择">
            <el-option v-for="dict in railwayNameobj" :label="dict.railwayName" :value="dict.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="车站名称" prop="stationName">
          <el-input v-model="forma.stationName" placeholder="请输入车站名称" style="width: 180px" />
        </el-form-item>
        <el-form-item label="车站编号" prop="stationCode">
          <el-input v-model="forma.stationCode" placeholder="请输入车站编号" style="width: 180px" />
        </el-form-item>
        <el-form-item label="中心里程" prop="centerMileageNumber">
          <el-input v-model="forma.centerMileageNumber" placeholder="请输入中心里程" style="width: 180px" />
        </el-form-item>
        <el-form-item label="起点里程" prop="startMileageNumber">
          <el-input v-model="forma.startMileageNumber" placeholder="请输入起点里程" style="width: 180px" />
        </el-form-item>
        <el-form-item label="终点里程" prop="endMileageNumber">
          <el-input v-model="forma.endMileageNumber" placeholder="请输入终点里程" style="width: 180px" />
        </el-form-item>
        <el-form-item label="拼音字头" prop="spellingPrefix">
          <el-input v-model="forma.spellingPrefix" placeholder="请输入拼音字头" style="width: 180px" />
        </el-form-item>
        <el-form-item label="车站等级" prop="stationLevelId">
          <el-select filterable clearable style="width: 180px" v-model="forma.stationLevelId" placeholder="请选择">
            <el-option v-for="dict in stationLevelobj" :label="dict.propertyName" :value="dict.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="轨距类型" prop="gaugeTypeId">
          <el-select filterable clearable style="width: 180px" v-model="forma.gaugeTypeId" placeholder="请选择">
            <el-option v-for="dict in gaugeTypeobj" :label="dict.propertyName" :value="dict.Id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="最小半径" prop="minRadius">
          <el-input v-model="forma.minRadius" placeholder="请输入最小半径" style="width: 180px" />
        </el-form-item>
        <el-form-item label="最大坡度" prop="maxGrade">
          <el-input v-model="forma.maxGrade" placeholder="请输入最大坡度" style="width: 180px" />
        </el-form-item>
        <el-form-item label="股道数" prop="trackNumber">
          <el-input v-model="forma.trackNumber" placeholder="请输入股道数" style="width: 180px" />
        </el-form-item>
        <el-form-item label="道岔数" prop="turnoutNumber">
          <el-input v-model="forma.turnoutNumber" placeholder="请输入道岔数" style="width: 180px" />
        </el-form-item>
        <el-form-item label="下行进站机" prop="downInboundMachine">
          <el-input v-model="forma.downInboundMachine" placeholder="请输入下行进站机" style="width: 180px" />
        </el-form-item>
        <el-form-item label="下行有效长" prop="downEffectiveLength">
          <el-input v-model="forma.downEffectiveLength" placeholder="请输入下行有效长" style="width: 180px" />
        </el-form-item>
        <el-form-item label="上行进站机" prop="upInboundMachine">
          <el-input v-model="forma.upInboundMachine" placeholder="请输入上行进站机" style="width: 180px" />
        </el-form-item>
        <el-form-item label="上行有效长" prop="upEffectiveLength">
          <el-input v-model="forma.upEffectiveLength" placeholder="请输入上行有效长" style="width: 180px" />
        </el-form-item>
        <el-form-item label="上行反向进站机" prop="upOppositeMachine">
          <el-input v-model="forma.upOppositeMachine" placeholder="请输入上行反向进站机" style="width: 180px" />
        </el-form-item>
        <el-form-item label="下行反向进站机" prop="downOppositeMachine">
          <el-input v-model="forma.downOppositeMachine" placeholder="请输入下行反向进站机" style="width: 180px" />
        </el-form-item>
        <el-form-item label="是否过站中心" prop="isPassCenter">
          <el-input v-model="forma.isPassCenter" placeholder="请输入是否过站中心" style="width: 180px" />
        </el-form-item>
        <el-form-item label="经度" prop="longitude">
          <el-input v-model="forma.longitude" placeholder="请输入经度" style="width: 180px" />
        </el-form-item>
        <el-form-item label="纬度" prop="latitude">
          <el-input v-model="forma.latitude" placeholder="请输入纬度" style="width: 180px" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script setup name="station">
import {
  insertManBasicStationListapi,
  selectManBasicStationListapi,
  editManBasicStationapi,
  selectManBasicRailwayListapi,
  selectManBasicUnitListapi,
  selectManBasicPropertyListapi,
} from "@/api/main/api.js";
import { reactive, ref, toRefs } from "vue";
defineExpose({ getList });
const emit = defineEmits(["parentCount"]);
const { proxy } = getCurrentInstance();
const loading = ref(true);
const title = ref("车站信息新增");
const open = ref(false);
const data = reactive({
  // 基础数据-单位数据表格数据
  stationList: [],
  // 查询参数
  queryParams: {
    pageNum: "1",
    pageSize: "10",
    railwayName: null,
    stationName: null,
    stationCode: null,
    railwayId: "",
  },
  stationLevelobj: [
    // { value: "一等", label: "一等" },
    // { value: "二等", label: "二等" },
    // { value: "三等", label: "三等" },
    // { value: "四等", label: "四等" },
    // { value: "五等", label: "五等" },
  ],
  gaugeTypeobj: [
    // {
    //   value: "准轨",
    //   label: "准轨",
    // },
  ],
  railwayNameobj: [],
  unitNameobj: [],
  // 表单参数
  forma: {},
  // 表单校验
  rules: {
    unitId: [{ required: true, message: "单位名称不能为空", trigger: ["blur", "change"] }],
    railwayId: [{ required: true, message: "线路名称不能为空", trigger: ["blur", "change"] }],
    stationName: [{ required: true, message: "车站名称不能为空", trigger: ["blur", "change"] }],
    stationCode: [{ required: true, message: "车站编号不能为空", trigger: ["blur", "change"] }],
    centerMileageNumber: [{ required: true, message: "中心里程不能为空", trigger: ["blur", "change"] }],
    stationLevelId: [{ required: true, message: "车站等级不能为空", trigger: ["blur", "change"] }],
    trackNumber: [{ required: true, message: "股道数不能为空", trigger: ["blur", "change"] }],
    turnoutNumber: [{ required: true, message: "道岔数不能为空", trigger: ["blur", "change"] }],
    downInboundMachine: [{ required: true, message: "下行进站机不能为空", trigger: ["blur", "change"] }],
    downEffectiveLength: [{ required: true, message: "下行有效长不能为空", trigger: ["blur", "change"] }],
    upInboundMachine: [{ required: true, message: "上行进站机不能为空", trigger: ["blur", "change"] }],
    upEffectiveLength: [{ required: true, message: "上行有效长不能为空", trigger: ["blur", "change"] }],
  },
  editobj: {},
  propertyList: [],
  railwayNamearr: [],
});
const { railwayNamearr, propertyList, queryParams, forma, rules, stationList, stationLevelobj, unitNameobj, railwayNameobj, editobj, gaugeTypeobj } =
  toRefs(data);

/** 查询基础数据-车站数据列表 */
const pageNumparent = ref(undefined);
const pageSizeparent = ref(undefined);
/** 查询列表 */
function getList(pageNum, pageSize) {
  loading.value = true;
  if (pageNum != undefined || pageSize != undefined) {
    pageNumparent.value = pageNum;
    pageSizeparent.value = pageSize;
    queryParams.value.pageNum = pageNum == undefined ? 1 : pageNum;
    queryParams.value.pageSize = pageSize == undefined ? 10 : pageSize;
  } else {
    queryParams.value.pageNum = pageNumparent.value == undefined ? "1" : pageNumparent.value;
    queryParams.value.pageSize = pageSizeparent.value == undefined ? "10" : pageSizeparent.value;
  }
  selectManBasicStationListapi(queryParams.value).then((res) => {
    if (res.code == 200) {
      stationList.value = res.data;
      const xian = {};
      railwayNamearr.value = stationList.value.reduce((next, item) => {
        xian[item.railwayName] == undefined ? (xian[item.railwayName] = true & next.push(item)) : "";
        return next;
      }, []);
      loading.value = false;
      emit("parentCount", res.count);
    }
  });
}
getList();
/** 查询基础数据-车站数据列表 */
function getList1() {
  selectManBasicRailwayListapi({ hasDelete: 0 }).then((res) => {
    if (res.code == 200) {
      railwayNameobj.value = res.data;
    }
  });
}
getList1();
/** 查询基础数据-车站数据列表 */
function getList2() {
  selectManBasicUnitListapi({ hasDelete: 0 }).then((res) => {
    if (res.code == 200) {
      unitNameobj.value = res.data;
    }
  });
}
getList2();
/** 查询基础数据-属性维护数据列表 */
function getList4() {
  selectManBasicPropertyListapi({ hasDelete: 0 }).then((res) => {
    if (res.code == 200) {
      propertyList.value = res.data;
      stationLevelobj.value = [];
      gaugeTypeobj.value = [];
      for (let i = 0; i < propertyList.value.length; i++) {
        if (propertyList.value[i].propertyType == "车站等级") {
          stationLevelobj.value.push(propertyList.value[i]);
        }
        if (propertyList.value[i].propertyType == "轨距类型") {
          gaugeTypeobj.value.push(propertyList.value[i]);
        }
      }
    }
  });
}
getList4();
// 取消按钮
function cancel() {
  open.value = false;
}
/** 搜索按钮操作 */
function handleQuery() {
  getList();
}
function congzhiQuery() {
  // 查询参数
  queryParams.value = {
    railwayName: null,
    stationName: null,
    stationCode: null,
    railwayId: "",
  };
  getList();
}
/** 新增按钮操作 */
function handleAdd() {
  open.value = true;
  forma.value = {
    unitId: "",
    railwayId: "",
    unitName: "",
    railwayName: "",
    stationName: "",
    stationCode: "",
    centerMileage: "",
    startMileageNumber: "",
    endMileageNumber: "",
    spellingPrefix: "",
    stationLevel: "",
    minRadius: "",
    maxGrade: "",
    trackNumber: "",
    turnoutNumber: "",
    downInboundMachine: "",
    downEffectiveLength: "",
    upInboundMachine: "",
    upEffectiveLength: "",
    upOppositeMachine: "",
    downOppositeMachine: "",
    isPassCenter: "",
    longitude: "",
    latitude: "",
    stationLevelId: "",
    gaugeTypeId: "",
  };
  title.value = "车站信息新增";
}
/** 修改按钮操作 */
function handleUpdate(row) {
  title.value = "车站信息修改";
  editobj.value = JSON.parse(JSON.stringify(row));
  forma.value = JSON.parse(JSON.stringify(row));
  open.value = true;
}
/** 提交按钮 */
function submitForm() {
  proxy.$refs["form"].validate((valid) => {
    if (valid) {
      if (forma.value.id != null) {
        const newforma = JSON.parse(JSON.stringify(forma.value));
        for (const key in editobj.value) {
          for (const keya in newforma) {
            if (key == keya && editobj.value[key] == newforma[keya] && key != "id") {
              Reflect.deleteProperty(newforma, keya);
              Reflect.deleteProperty(newforma, "params");
            }
          }
        }
        if (newforma.startMileageNumber != undefined) {
          newforma.startMileageNumber = Math.round(newforma.startMileageNumber * 1000000) / 1000000;
        }
        if (newforma.endMileageNumber != undefined) {
          newforma.endMileageNumber = Math.round(newforma.endMileageNumber * 1000000) / 1000000;
        }
        if (newforma.centerMileageNumber != undefined) {
          newforma.centerMileageNumber = Math.round(newforma.centerMileageNumber * 1000000) / 1000000;
        }
        if (Object.keys(newforma).length <= 1) {
          open.value = false;
        } else {
          editManBasicStationapi(newforma).then((res) => {
            proxy.$modal.msgSuccess("修改成功");
            open.value = false;
            getList();
          });
        }
      } else {
        forma.value.startMileageNumber = Math.round(forma.value.startMileageNumber * 1000000) / 1000000;
        forma.value.endMileageNumber = Math.round(forma.value.endMileageNumber * 1000000) / 1000000;
        forma.value.centerMileageNumber = Math.round(forma.value.centerMileageNumber * 1000000) / 1000000;
        insertManBasicStationListapi(forma.value).then((res) => {
          proxy.$modal.msgSuccess("新增成功");
          open.value = false;
          getList();
        });
      }
    }
  });
}
</script>
